<template>
	<div>
		<div class="abnormal_container">
      <div v-if="headIos" style="z-index:9; width: 100%; height: 20px;background: white;position: fixed;top: 0;"></div>
			<k-header headTitle="背调报告" goBack="true"></k-header>
			<boxconfirm content_title="网络异常请稍后重试。" content_confirm="确定" content_cancel="取消" @confirmClick="webqueding" ref="boxconfirm"></boxconfirm>
	   		<boxconfirm content_title="立即发起授权失败，请重新提交。" content_confirm="确定" content_cancel="取消" @confirmClick="queding" ref="qboxconfirm"></boxconfirm>
			<div :class="headIos?'archieve_containerr-ios':'entry_contentt'">
				<div class="abnormal_content" v-if="refuseauth && warrant">
					<div class="abnormal_content_status">
						<div class="abnormal_content_img"></div>
						<div class="abnormal_content_statu">审核未通过</div>
					</div>
					<div class="abnormal_content_detail">{{unAuthRemark}}</div>
				</div>
				<div class="abnormal_content" v-if="refuseauth && smsnotice">
					<div class="abnormal_content_status">
						<div class="abnormal_content_img"></div>
						<div class="abnormal_content_statu">申请被拒绝</div>
					</div>
					<div class="abnormal_content_detail">
						<span>{{name}}</span>拒绝您的背调申请，请您检查背调对象信息，或与背调对象沟通后，再次发起申请。
					</div>
				</div>
				<div class="abnormal_content" v-if="authover">
					<div class="abnormal_content_status">
						<div class="abnormal_content_img"></div>
						<div class="abnormal_content_statu">授权链接过期</div>
					</div>
					<div class="abnormal_content_detail">
						张某某请您重新发送授权申请。
					</div>
				</div>
				<div class="abnormal_content" v-if="unauth">
					<div class="abnormal_content_status">
						<div class="abnormal_content_img"></div>
						<div class="abnormal_content_statu">待审核</div>
					</div>
					<div class="abnormal_content_detail">
						您提交的报告正在审核中，请耐心等待。
					</div>
				</div>
				<div class="abnormal_content" v-if="review">
					<div class="abnormal_content_status">
						<div class="abnormal_content_img"></div>
						<div class="abnormal_content_statu">待生成</div>
					</div>
					<div class="abnormal_content_detail">
						您提交的报告正在审核中，请耐心等待。
					</div>
				</div>

				<div class="abnormal_content" v-if="investigation">
					<div class="abnormal_content_status">
						<div class="abnormal_content_img"></div>
						<div class="abnormal_content_statu">被调人信息错误</div>
					</div>
					<div class="abnormal_content_detail">
						被调人姓名、身份证号、手机号码系统校验不一致<br>故无法生成报告。
					</div>
				</div>

				<div class="abnormal_info">
					<div class="abnormar_info_one">
						<div class="abnormal_info_candidate">背调对象信息</div>
						<div class="abnormal_info_black"></div>
						<div v-if="authover || (refuseauth && smsnotice)" class="abnormal_info_improve" @click="gostartcheck">修改信息</div>
					</div>
					<div class="abnormal_info_two">
						<span class="balel_left">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名：</span>
						<span class="balel_right">{{name}}</span>
					</div>
					<div class="abnormal_info_two">
						<span class="balel_left">身份证号：</span>
						<span class="balel_right">{{idCard}}</span>
					</div>
					<div class="abnormal_info_two">
						<span class="balel_left">手机号码：</span>
						<span class="balel_right">{{mobile}}</span>
					</div>
				</div>
				<div class="abnormal_info" v-if="refuseauth && smsnotice">
					<div class="abnormar_info_one">
						<div class="abnormal_info_candidate">背调对象留言</div>
					</div>
					<div class="abnormal_info_two">
						<span class="balel_left">拒绝理由：</span>
						<span class="balel_right">{{unAuthRemark}}</span>
					</div>
				</div>
				<div class="abnormal_info_apply" v-if="authover || (refuseauth && smsnotice)">
					<a :id="mobile" :href="tel" class="call" >致电背调对象</a>
					<button :disabled="auth" class="auth" @click="goright">立即发起授权</button>
				</div>
				<div class="abnormal_info_apply" v-if="refuseauth && warrant && usSourceTypeSec" @click="gostartcheck">
					<a class="improve">修改信息</a>
				</div>
				<div class="abnormal_info_apply" v-if="investigation && selfSearch && usSourceTypeSec" @click="gostartcheck">
					<a class="improve">修改信息</a>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import kHeader from '../common/head';
	import util from '../../libs/util';
	import boxconfirm from '../common/boxconfirm';
	export default {
		data () {
            return {
            	dis : false,
            	unauth:false,
            	review:false,
            	refuseauth:false,
            	authover:false,
            	smsnotice:false,
            	warrant:false,
            	showDetails:false,
							auth:false,
							investigation:false,
            	name:'',
            	idCard:'',
            	mobile:'',
            	unAuthRemark:'',
            	tel:'',
            	id:'',
            	goodsList:'',
							sourceType:'',
							usSourceTypeSec:true,
							unAuthRemark:'',
							headIos:false,
							selfSearch:true
            }
        },
        components: {
        	kHeader,
        	boxconfirm
        },
        methods:{
            axIos(){
							var that = this;
		        	var url = '/lblsapp-h5/v2/report/queryReqCreditReportById.json';
		        	let data = {id:that.id};
		        	util.ajax.post(url, data).then(function(data){
		        		if(data.data.code==='0'){
									that.showDetails=true;
									if (data.data.res.data.goodsUseType == 'SELFEXAMINATIONGOODS') {
										that.selfSearch = false;
									} else {
										that.selfSearch = true;
									}
									if (data.data.res.data.isAuthPassed === '0') {
										switch (data.data.res.data.reportStatus) {
											case 'UNAUTH':
												that.unauth = true;
												break;
											case 'REVIEW':
												that.review = true;
												break;
											case 'REFUSEAUTH':
												that.refuseauth = true;
												break;
											case 'AUTHOVER':
												that.authover = true;
												break;
										};
									} else {
										that.investigation = true;
									}
									switch (data.data.res.data.reportAuthType) {
										case 'SMSNOTICE':
											that.smsnotice = true;
											break;
										case 'WARRANT':
											that.warrant = true;
											break;
									};
									that.name = data.data.res.data.name;
									that.mobile = data.data.res.data.mobile;
									that.idCard = data.data.res.data.idCard;
									that.unAuthRemark = data.data.res.data.unAuthRemark;
									that.goodsList = data.data.res.data.goodsList;
									that.sourceType = data.data.res.data.sourceType;
									if(that.sourceType ==='SECRETFILES'){
										that.usSourceTypeSec=false;
									};
									that.unAuthRemark = data.data.res.data.unAuthRemark;
									that.tel = 'tel:' + that.mobile;
								};
		        	}).catch(function(error){
								console.log(error)
		            // that.$refs.boxconfirm.show();
		        	})
            },
            gostartcheck(){
            	this.$router.push({ path: '/startcheck',query: {name:this.name,idCard:this.idCard,mobile:this.mobile,sourceType:this.sourceType}})
            },
            goright(){
            	var that=this;
            	that.auth=true;
            	var url ='/lblsapp-h5/v2/report/updateReqCreditReportByOldReport.json';
            	let data = {id:that.id};
            	util.ajax.post(url, data).then(function(data){
								var isright = JSON.parse(data.data.res.msg).status==='2';
								that.id = JSON.parse(data.data.res.msg).id;
            	 	if(data.data.code==='0'){
            	 		if(isright){
            	 			that.$refs.qboxconfirm.show();
            	 		}else{
            	 			var url = '/lblsapp-h5/v2/report/updateReqCreditReportByBalancePay.json';
            	 			let data={client : 'NEWH5' , goodsList : that.goodsList,reqReportId:that.id};
            	 			util.ajax.post(url, data).then(function(data){
            	 				if(data.data.code=== '0'){
            	 					that.$router.go(0);
            	 				}else{
            	 					that.$refs.qboxconfirm.show();
            	 					that.auth=false;
            	 				}

            	 			}).catch(function(error){
					            that.$refs.qboxconfirm.show();
					            that.auth=false;
					        })
            	 		}
            	 	}else{
            	 		that.$refs.qboxconfirm.show();
            	 		that.auth=false;
            	 	}
            	}).catch(function(error){
		            that.$refs.qboxconfirm.show();
		            that.auth=false;
		        })
            },
            queding(){
            	this.goright();
            },
            webqueding(){
            	this.axIos();
            }
        },
        mounted () {
			this.axIos();
		},
		created(){
			if (window.navigator.userAgent.indexOf('LBLSIOS') > -1) {
				this.headIos = true
			} else {
				this.headIos = false
			};
			this.id = this.$route.query.id;
		},
	}
</script>

<style>
	.abnormal_container{
	    height: 100%;
    	box-sizing: border-box;
    	/* padding-top: 45px; */
    	background: #f5f5f5;
	}
	.abnormal_container-ios{
			height: 100%;
    	box-sizing: border-box;
    	/* padding-top: 65px; */
    	background: #f5f5f5;
	}
	.abnormal_content{
		padding: 24px 45px 24px 15px;
		box-sizing: border-box;
		background: #FF624C;
	}
	.abnormal_content_status{
		display: flex;
		height: 20px;
	}
	.abnormal_content_img{
		margin-right: 6px;
		height: 20px;
		flex: 0 0 20px;
		background:url(../../assets/img/reference/failture.png) no-repeat center;
		background-size: 20px 20px;
	}
	.abnormal_content_statu{
		flex: 1;
		height: 20px;
		line-height: 20px;
		font-size: 2rem;
		color: #FFFFFF;
	}
	.abnormal_content_detail{
		margin-top: 8px;
		font-size: 1.4rem;
		color: #FFFFFF;
		letter-spacing: 0;
		line-height: 24px;
	}
	.abnormal_info{
		width: 92%;
		padding: 0 10px 0 15px;
		margin: 10px auto;
		background: #FFFFFF;
		box-sizing: border-box;
	}
	.abnormar_info_one{
		height: 50px;
		line-height: 50px;
		display: flex;
	}
	.abnormal_info_candidate{
		flex: 0 0 auto;
		font-size: 1.6rem;
		color: #212121;
	}
	.abnormal_info_black{
		flex: 1;
	}
	.abnormal_info_improve{
		flex: 0 0 auto;
		font-size: 1.2rem;
		color: #F89721;
	}
	.abnormal_info_two{
		line-height: 38px;
		display: flex;
	}
	.balel_left{
		color: #808080;
		font-size: 1.2rem;
		margin-right: 4px;
		flex: 0 0 auto;
	}
	.balel_right{
		font-size: 1.2rem;
		color: #0F0F0F;
		flex: 1;
	}
	.abnormal_info_apply{
	    width: 92%;
	    padding: 0 10px 0 15px;
	    margin: 30px auto;
	    box-sizing: border-box;
	    font-size: 0;
	}
	.call{
		display: inline-block;
		height: 42px;
		line-height: 42px;
		width: 48%;
		margin-right: 4%;
		background: #FFFFFF;
		border-radius: 2px;
		font-size: 14px;
		color: #F89721;
		text-align: center;
	}
	.auth{
		display: inline-block;
		height: 42px;
		line-height: 42px;
		text-align: center;
		width: 48%;
		background: #F89721;
		border-radius: 2px;
		font-size: 14px;
		color: #FFFFFF;
		border: none;
	}
	.improve{
		display: inline-block;
		height: 42px;
		line-height: 42px;
		width: 100%;
		text-align: center;
		background: #F89721;
		border-radius: 2px;
		font-size: 1.4rem;
		color: #FFFFFF;
	}
	.web_error{
		width: 92%;
	    padding: 0 10px 0 15px;
	    margin: 10px auto;
	    background: #FF624C;
	    font-size: 2rem;
	    text-align: center;
	    box-sizing: border-box;
	}
</style>
